<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>滚动监听</title>
    <link href="../../../css/bootstrap.min.css" rel="stylesheet">

</head>
<body data-spy="scroll" data-target=".navbar" data-offset="100">
    <div class="container">
         <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
                <div class="container-fluid">
                    <div class="collapse navbar-collapse js-navbar-scrollspy" id="myScrollspy">
                        <ul class="nav navbar-nav">
                            <li><a href="#iwen">@iwen</a></li>
                            <li><a href="#iwe">@iwen</a></li>
                            <li class="dropdown">
                                <a href="#"class="dropdown-toggle"data-toggle="dropdown">下拉菜单<b class="caret"></b></a>
                                <ul class="dropdown-menu" role="menu">
                                    <li><a href="#one" tabindex="-1">one</a></li>
                                    <li><a href="#two" tabindex="-1">two</a></li>
                                    <li><a href="#three" tabindex="-1">three</a></li>
                                </ul>
                            </li>
                        </ul>
                    </div>
                </div>
         </nav>
        <h2 id="iwen">@iwen</h2>
        <p>这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人</p>
        <h2 id="iwe">@iwe</h2>
        <p>这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人</p>
        <h2 id="one">one</h2>
        <p>这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人</p>
        <p>这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人</p>
        <p>这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人</p>
        <p>这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人</p>
        <h2 id="two">two</h2>
        <p>这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人</p>
        <h2 id="three">three</h2>
        <p>这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人
            这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人这是一个人</p>
    </div>
    <script src="../../../js/jquery-2.1.1.js"></script>
    <script src="../../../js/bootstrap.min.js"></script>
    <script>
        $("#myScrollspy").on("activate.bs.scrollspy",function(e){
//            alert("Hello");
        })
    </script>
</body>
</html>